<%--
  Created by IntelliJ IDEA.
  User: 86158
  Date: 2022/9/21
  Time: 20:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录页面</title>
    <link href="${pageContext.request.contextPath}/layui/css/layui.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/supersized.css">
    <script src="${pageContext.request.contextPath}/js/jquery-1.8.2.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/supersized.3.2.7.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/supersized-init.js"></script>

    <style>
        * {
            margin: 0 auto;
            padding: 0;
        }

        #div1 {
            text-align: center;
            width: 500px;
            height: 400px;
            background-color: white;
        }

        #title {
            padding-top: 40px;
            padding-bottom: 30px;
            color: #1e9fff;

        }

        .input1 {
            background-color: rgba(115, 189, 236, 0.78);
        }

        .icon {
            font-size: 30px;
            font-weight: bold;
            color: #1e9fff;
        }
    </style>
</head>
<body style="align-items: center;display: flex;">
<div id="div1" class="layui-main">
    <h1 id="title">HRM人事管理系统</h1>
    <hr>
    <br>
    <form class="layui-form layui-form-pane" action="${pageContext.request.contextPath}/user/login" method="post">

        <div class="layui-form-item" style="margin-left: 50px">
            <label class="layui-form-label"><i class="layui-icon layui-icon-username icon"></i></label>
            <div class="layui-input-inline">
                <input type="text" name="loginName"  required lay-verify="required" placeholder="请输入账号"
                       autocomplete="off" class="layui-input input1">
            </div>
        </div>
        <div class="layui-form-item" style="margin-left: 50px">
            <label class="layui-form-label"><i class="layui-icon layui-icon-password icon"></i></label>
            <div class="layui-input-inline">
                <input type="password" name="password"  required lay-verify="required" placeholder="请输入密码"
                       autocomplete="off" class="layui-input input1">
            </div>
        </div>
        <div class="layui-form-item" style="margin-left: 50px">
            <label class="layui-form-label"><i class="layui-icon layui-icon-vercode icon"></i> </label>
            <div class="layui-input-inline">
                <input type="text" id="checkCode" name="checkCode" required lay-verify="required" placeholder="验证码"
                       autocomplete="off" class="layui-input input1">
            </div>
            <div class="layui-form-mid" style="padding: 0!important;">
                <img id="vercode" src="${pageContext.request.contextPath}/checkCode" alt="">
            </div>
        </div>

        <div class="layui-form-item">
                <input type="checkbox" title="7天免登录" name="autoLogin" value="1">
        </div>

        <div class="layui-form-item">
            <div class="layui-inline">
                <div class="layui-input-inline">
                    <button class="layui-btn layui-btn-normal" lay-submit lay-filter="loginInfo">登录</button>
<%--                    <button type="reset" class="layui-btn layui-btn-normal">重置</button>--%>
                    <button type="button" id="register" class="layui-btn layui-btn-normal">注册</button>
                </div>
            </div>
        </div>

    </form>
</div>

</body>
<script>
    //Demo
    layui.use(['form','jquery','layer'], function () {
        var form = layui.form;
        var $ = layui.jquery;
        var layer = layui.layer;

        var info = "${sessionScope.info}";
        ${sessionScope.remove("info")};
        if (info != ""){
            layer.msg(info,{icon:2});
        }
        //提交
        form.on('submit(loginInfo)', function (data) {

            return true;
        });

        //点击刷新验证码
        $("#vercode").click(function () {
            $("#vercode").attr("src","${pageContext.request.contextPath}/checkCode?time=" + new Date().getTime());
        })

        $("#register").click(function () {
            layer.open({
                type: 2,
                title: false,
                content: '${pageContext.request.contextPath}/toRegister',
                area: ['500px','560px']

            });
        })
    });
</script>
</html>
